<template>
  <div class="base-content">
    <div class="basic-info">
      <el-form ref="filterForm" :model="filterForm" inline>
        <div>
          <el-form-item label="样品编号" prop="sampleNum">
            <el-input
              v-model="filterForm.sampleNum"
              placeholder="样品编号"
              clearable
            />
          </el-form-item>

          <el-form-item label="品号" prop="sampleModel">
            <el-input
              v-model="filterForm.sampleModel"
              placeholder="品号"
              clearable
            />
          </el-form-item>
          <el-form-item label="领取人" prop="permissionUserName">
            <el-input
              v-model="filterForm.permissionUserName"
              placeholder="领取人"
              clearable
            />
          </el-form-item>
          <el-form-item class="base-filter-button">
            <el-button
              v-loading="searchLoading"
              type="primary"
              @click="getList('filter')"
              >查询</el-button
            >
            <el-button @click="cancelForm">清空</el-button>
          </el-form-item>
        </div>
        <div>
          <el-form-item label="领取/出库日期" prop="receivingDate">
            <el-date-picker
              v-model="filterForm.receivingDate"
              type="daterange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </el-form-item>
        </div>
      </el-form>
      <!--操作栏-->
      <div class="base-content-operate">
        <el-button
          v-rights="'Export'"
          icon="el-icon-document-copy"
          type="primary"
          @click="exportData()"
          >导出</el-button
        >
        <el-button
          v-rights="'Add'"
          :disabled="!submitLoad"
          icon="el-icon-document-copy"
          type="danger"
          @click="scrapData()"
          >报废</el-button
        >
      </div>
      <el-table
        ref="table"
        v-loading="tableLoad"
        :data="tableData"
        height="calc(100% - 190px)"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" fixed> </el-table-column>
        <el-table-column prop="orderNum" label="委托单号" fixed />
        <el-table-column prop="sampleNum" label="样品编号" fixed />
        <el-table-column label="样品名称" fixed>
          <template slot-scope="scope">
            {{ scope.row.sampleName }}
          </template>
        </el-table-column>
        <el-table-column label="样品管理状态">
          <template slot-scope="scope">
            {{ scope.row.sampleManageState }}
          </template>
        </el-table-column>
        <el-table-column label="库/站名">
          <template slot-scope="scope">
            {{ scope.row.sampleDeliveryInfo.samplingAddress }}
          </template>
        </el-table-column>
        <el-table-column label="品号">
          <template slot-scope="scope">
            {{ scope.row.sampleModel }}
          </template>
        </el-table-column>
        <el-table-column prop="entrustPeople" label="接收数量">
          <template slot-scope="scope">
            {{
              scope.row.sampleReceiving != null
                ? scope.row.sampleReceiving.sampleCount
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="接收/入库日期 ">
          <template slot-scope="scope">
            {{
              scope.row.sampleReceiving != null
                ? scope.row.sampleReceiving.receivingDate
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="领取数量 ">
          <template slot-scope="scope">
            {{
              scope.row.sampleCollectionShowDto != null
                ? scope.row.sampleCollectionShowDto.sampleCollectionCount
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="领取/出库日期">
          <template slot-scope="scope">
            {{
              scope.row.sampleCollectionShowDto != null
                ? dateFormat(
                    scope.row.sampleCollectionShowDto.sampleCollectionDate
                  )
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="领取人 ">
          <template slot-scope="scope">
            {{
              scope.row.sampleCollectionShowDto != null
                ? scope.row.sampleCollectionShowDto.permissionUserName
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="留存数量">
          <template slot-scope="scope">
            {{
              scope.row.sampleStore != null
                ? scope.row.sampleStore.sampleStoreCount
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="留存入库日期">
          <template slot-scope="scope">
            {{
              scope.row.sampleStore != null
                ? scope.row.sampleStore.sampleStoreDate
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="保存时间">
          <template slot-scope="scope">
            {{
              scope.row.sampleStore != null
                ? scope.row.sampleStore.saveDate
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column label="制表人">
          <template slot-scope="scope">
            <span
              v-if="
                scope.row.makeTablePersonName != null &&
                scope.row.makeTablePersonName != ''
              "
              >{{ scope.row.makeTablePersonName }}</span
            >
          </template>
        </el-table-column>
        <el-table-column label="经办人">
          <template slot-scope="scope">
            {{ scope.row.agencyPerson }}
          </template>
        </el-table-column>
        <el-table-column label="接收人">
          <template slot-scope="scope">
            {{ scope.row.receivePerson }}
          </template>
        </el-table-column>
        <el-table-column label="批准">
          <template slot-scope="scope">
            {{ scope.row.ratify }}
          </template>
        </el-table-column>
        <el-table-column label="状态">
          <template slot-scope="scope">{{
            scope.row.sampleRegistrationShowDto.sampleBusinessStatus
          }}</template>
        </el-table-column>
        <el-table-column label="备注">
          <template slot-scope="scope">{{ scope.row.remark }}</template>
        </el-table-column>
        <el-table-column label="操作" width="140">
          <template slot-scope="{ row }">
            <div class="base-table-operation">
              <el-link v-rights="'Edit'" type="primary" @click="editUnit(row)"
                >编辑</el-link
              >
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页 -->
      <BasePagination
        :total="pagination.total"
        :current-page="pagination.pageIndex"
        @changePage="changePage"
        @sizeChange="sizeChange"
      />
    </div>
    <SampleStandingBookDialog
      v-if="dialogFormVisible"
      ref="SampleStandingBookDialog"
      :dialog-form-visible.sync="dialogFormVisible"
      :row-data.sync="rowData"
      :update-state.sync="updateState"
      :scrap-state.sync="scrapState"
      @closeDialog="closeDialog"
    />
  </div>
</template>

<script>
import { shortTime } from "../../../utils/moment.js";
// export { parseTime } from "@/utils";
import SampleStandingBookDialog from "./SampleStandingBookDialog.vue";
import _ from "lodash";
import {
  getList,
  UpdateSampleInfo,
} from "../../../api/SampleManage/EntrustSampleInfo";
export default {
  name: "SampleStandingBookList",
  components: { SampleStandingBookDialog },
  data() {
    return {
      submitLoad: true,
      searchLoading: false,
      filterForm: {
        sampleNum: "",
        sampleModel: "",
        permissionUserName: "",
        receivingDate: [],
      },
      pagination: {
        pageIndex: 1,
        pageSize: 10,
        total: 0,
      },
      tableLoad: false,
      tableData: [],
      tableDatas: [],
      // 样品报废数据
      sampleScrapData: [],
      dialogFormVisible: false,
      rowData: [],
      updateState: false,
      scrapState: false,
    };
  },
  computed: {},
  created() {
    this.getList();
  },
  methods: {
    dateFormat(data) {
      return shortTime(data);
    },
    // 关闭dialog
    closeDialog() {
      this.dialogFormVisible = false;
      this.updateState = false;
      this.scrapState = false;
      this.rowData = [];
      this.getList();
    },
    // 报废
    scrapData: _.throttle(function() {
      if (this.submitLoad) {
        this.submitLoad = false;
        if (this.tableDatas === null || this.tableDatas.length === 0) {
          this.$message.error("请选择数据");
          this.submitLoad = true;
          return false;
        }

        var data = [];
        for (let i = 0; i < this.tableDatas.length; i++) {
          if (Number(this.tableDatas[i].sampleManageStateCode) !== 20) {
            this.$message.error("请选择已留存数据");
            this.submitLoad = true;

            return false;
          } else {
            data.push({
              id: this.tableDatas[i].id,
              sampleManageStatusCode: 30,
            });
          }
        }
        UpdateSampleInfo(data)
          .then((res) => {
            this.getList();
            this.submitLoad = true;
          })
          .catch(() => {
            this.submitLoad = true;
          });
        // var start = 0;
        // for (let i = 0; i < this.tableDatas.length; i++) {
        //   if (this.tableDatas[i].sampleScrapShowDto == null) {
        //     this.tableDatas[i].sampleScrapShowDto = {
        //       entrustOrderId: this.tableDatas[i].entrustOrderId,
        //       sysBusinessSampleInfoId: this.tableDatas[i].id,
        //       sampleScrapCount: 0,
        //       sampleScrapDate: "",
        //       sampleScrapTypeCode: "",
        //       sampleScrapAddress: "",
        //     };
        //   } else {
        //     start = 1;
        //   }
        // }
        // if (start === 1) {
        //   this.$message.error("请选择未报废数据");
        //   return false;
        // }
        // this.rowData = this.tableDatas;
        // this.scrapState = true;
        // this.dialogFormVisible = true;
      }
    }, 2000),
    // 编辑
    editUnit(row) {
      this.rowData.push(row);
      this.updateState = true;
      this.dialogFormVisible = true;
    },
    // 清空筛选条件
    cancelForm() {
      this.$refs.filterForm.resetFields();
      this.getList("filter");
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map((v) =>
        filterVal.map((j) => {
          return v[j];
        })
      );
    },
    // 导出
    exportData() {
      if (this.tableDatas === null || this.tableDatas.length === 0) {
        this.$message.error("请选择数据");
        return false;
      }
      var list = [];
      for (let i = 0; i < this.tableDatas.length; i++) {
        list.push({
          orderNum: this.tableDatas[i].orderNum,
          sampleNum: this.tableDatas[i].sampleNum,
          sampleName: this.tableDatas[i].sampleName,
          samplingAddress:
            this.tableDatas[i].sampleDeliveryInfo.samplingAddress,
          sampleModel: this.tableDatas[i].sampleModel,
          entrustPeople:
            this.tableDatas[i].sampleReceiving != null
              ? this.tableDatas[i].sampleReceiving.sampleCount
              : "",
          receivingDate:
            this.tableDatas[i].sampleReceiving != null
              ? this.tableDatas[i].sampleReceiving.receivingDate
              : "",
          sampleCollectionCount:
            this.tableDatas[i].sampleCollectionShowDto != null
              ? this.tableDatas[i].sampleCollectionShowDto.sampleCollectionCount
              : "",
          sampleCollectionDate:
            this.tableDatas[i].sampleCollectionShowDto != null
              ? this.tableDatas[i].sampleCollectionShowDto.sampleCollectionDate
              : "",
          permissionUserName:
            this.tableDatas[i].sampleCollectionShowDto != null
              ? this.tableDatas[i].sampleCollectionShowDto.permissionUserName
              : "",
          sampleStoreCount:
            this.tableDatas[i].sampleStore != null
              ? this.tableDatas[i].sampleStore.sampleStoreCount
              : "",
          sampleStoreDate:
            this.tableDatas[i].sampleStore != null
              ? this.tableDatas[i].sampleStore.sampleStoreDate
              : "",
          saveDate:
            this.tableDatas[i].sampleStore != null
              ? this.tableDatas[i].sampleStore.saveDate
              : "",
          sampleScrapCount:
            this.tableDatas[i].sampleScrapShowDto != null
              ? this.tableDatas[i].sampleScrapShowDto.sampleScrapCount
              : "",
          sampleScrapDate:
            this.tableDatas[i].sampleScrapShowDto != null
              ? this.tableDatas[i].sampleScrapShowDto.sampleScrapDate
              : "",
          sampleScrapType:
            this.tableDatas[i].sampleScrapShowDto != null
              ? this.tableDatas[i].sampleScrapShowDto.sampleScrapType
              : "",
          sampleScrapAddress:
            this.tableDatas[i].sampleScrapShowDto != null
              ? this.tableDatas[i].sampleScrapShowDto.sampleScrapAddress
              : "",
          makeTablePersonName: this.tableDatas[i].makeTablePersonName,
          agencyPerson: this.tableDatas[i].agencyPerson,
          receivePerson: this.tableDatas[i].receivePerson,
          ratify: this.tableDatas[i].ratify,
          sampleBusinessStatus:
            this.tableDatas[i].sampleRegistrationShowDto.sampleBusinessStatus,
          remark: this.tableDatas[i].remark,
        });
      }
      import("@/vendor/Export2Excel").then((excel) => {
        const tHeader = [
          "委托单号",
          "样品编号",
          "样品名称",
          "样品管理状态",
          "库/站名",
          "品号",
          "接收数量",
          "接收/入库日期",
          "领取数量",
          "领取/入库日期",
          "领取人",
          "留存数量",
          "留存入库日期",
          "保存时间",
          "报废数量",
          "报废日期",
          "报废类型",
          "退回地点",
          "制表人",
          "经办人",
          "接收人",
          "批准",
          "状态",
          "备注",
        ];
        const filterVal = [
          "orderNum",
          "sampleNum",
          "sampleName",
          "sampleManageState",
          "samplingAddress",
          "sampleModel",
          "entrustPeople",
          "receivingDate",
          "sampleCollectionCount",
          "sampleCollectionDate",
          "permissionUserName",
          "sampleStoreCount",
          "sampleStoreDate",
          "saveDate",
          "sampleScrapCount",
          "sampleScrapDate",
          "sampleScrapType",
          "sampleScrapAddress",
          "makeTablePersonName",
          "agencyPerson",
          "receivePerson",
          "ratify",
          "sampleBusinessStatus",
          "remark",
        ];
        const data = this.formatJson(filterVal, list);
        excel.export_json_to_excel({
          header: tHeader, // 表头
          data, // 数据
          filename: "样品台账信息", // 导出文件名
          autoWidth: true, // 导出宽度自动
          bookType: "xlsx", // 导出后缀
        });
      });
    },
    handleSelectionChange(val) {
      this.tableDatas = val;
    },
    sizeChange(val) {
      this.pagination.pageIndex = 1;
      this.pagination.pageSize = val;
      this.getList();
    },
    changePage(page) {
      this.pagination.pageIndex = page;
      this.getList();
    },
    getList(flag) {
      if (flag) {
        this.pagination.pageIndex = 1;
      }
      this.loading = true;
      getList({ ...this.filterForm, ...this.pagination })
        .then((res) => {
          this.tableData = res.data.dataList ? res.data.dataList : [];
          this.pagination.total = res.data.total;
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
  },
};
</script>
